<div class="container">
    <div class="row">
        <div class="col-md-3">
            <div class="panel panel-default">
                <div class="panel-heading">
                    <h3 class="panel-title">
                        {{pageTitle}}
                    </h3>
                </div>
                <ul class="list-group">
                    <li class="list-group-item">
                        <a [routerLink]="['/welcome']">Home</a>
                    </li>
                    <li class="list-group-item">
                        <a [routerLink]="['/products']">Product List</a>
                    </li>
                    <li class="list-group-item">
                        <a [routerLink]="['/addproduct']">Add Product</a>
                    </li>
                    <li class="list-group-item">
                        <a [routerLink]="['/adduser']">Add User</a>
                    </li>
                    <li class="list-group-item">
                        <a [routerLink]="['/typedsha']">Using Third Party Libraries / Typed</a>
                    </li>
                    <li class="list-group-item">
                        <a [routerLink]="['/untypedsha']">Using Third Party Libraries / UnTyped</a>
                    </li>
                    <li class="list-group-item">
                        <a [routerLink]="['/usingjquery']">Using jQuery Plugins</a>
                    </li>
                </ul>
            </div>
        </div>
        <div class="col-md-9">
            <router-outlet></router-outlet>
        </div>
    </div>
</div>